<div id="tb<?php echo $uniqid;?>" style="padding:5px">
    <table cellspacing="0" cellpadding="0">
        <tbody>
        <tr>
            <td>
                <select id="dianpuCategoryKeywordsType" class="forminput inputstyle textbox-text validatebox-text" style="width:120px; border-color: #cccccc !important;">
                    <option value="dianpu_id">店铺ID</option>
                    <option value="member_id">管理员ID</option>
                    <option value="member_phone">管理员电话</option>
                </select>
                <input id="dianpuCategoryKeywords" style="width:100px" placeholder="输入搜索内容" type="text" class="easyui-input textbox">
                <a href="javascript:void(0);" onclick="dianpuCategorySearch();" class="l-btn l-btn-small l-btn-plain"><span
                        class="l-btn-left l-btn-icon-left"><i class="iconfont icon-sousuo"></i><span class="l-btn-text">查询</span></span></a>
            </td>
            <td><div class="datagrid-btn-separator"></div></td>
            <td><a href="javascript:;" onclick="dianpuCategoryReload();" class="l-btn l-btn-small l-btn-plain"><span
                    class="l-btn-left l-btn-icon-left"><i class="iconfont icon-shuaxin"></i><span class="l-btn-text">重载</span></span></a></td>
        </tr>
        </tbody>
    </table>
</div>
<div class="con"  style="-moz-user-select:none;">
    <table id="dianpuCategoryTable"></table>
</div>
<div id="dianpuCategoryDlg" class="easyui-dialog" style="width:720px; height:450px;" title="信息框" closed="true"></div>
<script>
    var dianpuCategoryReload = function () {
        $("#dianpuCategoryTable").treegrid('reload');
    };
    var dianpuCategorySearch = function () {
        var height = $(window).height() - $(".top").height() - 46;
        var width = $(window).width() - $(".leftmenu").width() - 8;
        $("#dianpuCategoryTable").treegrid({
            title: '店铺商品分类',
            width: width,
            height: height,//高度
            singleSelect: true,//如果为true，则只允许选择一行
            striped: true,//是否显示斑马线效果。
            rownumbers: false,//如果为true，则显示一个行号列。
            pagination: true,//是否显示分页
            pageSize: 10,
            pageList: [10, 15, 20, 25],
            method: 'post',
            sortName: 'weigh',
            sortOrder: 'desc',
            idField: 'id',
            treeField: 'name',
            url: '/admin/dianpu_category/index',
            queryParams: {
                keywords: $('#dianpuCategoryKeywords').val(),
                keywords_type: $('#dianpuCategoryKeywordsType').val(),
            },
            fitColumns: true,//真正的自动展开/收缩列的大小，以适应网格的宽度，防止水平滚动。
            nowrap: true,//如果为true，则在同一行中显示数据。设置为true可以提高加载性能。 是否换行
            selectOnCheck: false,
            checkOnSelect: true,
            toolbar: '#tb<?php echo $uniqid;?>',
            columns: [[
                {field: 'id', title: 'ID', width: fixWidth(5)},
                {field: 'name', title: '名称', width: fixWidth(20)},
                {field: 'dianpu', title: '店铺', width: fixWidth(20), formatter:function (value) {
                    if(value){
                        return value.name;
                    }else{
                        return '---';
                    }
                    }},
                {field: 'image', title: '图片', align:'center', width: fixWidth(7), formatter:function (value){
                        return "<img src='" + value + "' height='35px' style='border-radius: 5px;' />";
                    }},
                {field: 'weigh', title: '排序', width: fixWidth(5)},
                {field: 'status', title: '状态', width: fixWidth(5), formatter:function (value){
                        return value==='normal' ? '显示' : '隐藏';
                    }, styler:function (value) {
                        return value==='normal' ? 'color:green' : 'color:red';
                    }},
                {field: 'description', title: '描述', width: fixWidth(10)},
            ]]
        });
    };
    dianpuCategorySearch();
    onTreegridResize('#dianpuCategoryTable');
</script>
